<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>个人信息</title>
<%-- <link rel="stylesheet" href="<%=request.getContextPath() %>/resource/css/common.css" /> --%>
<link rel="stylesheet" href="<%=request.getContextPath() %>/resource/css/personInfo.css" />
<%-- <script type="text/javascript" src="<%=request.getContextPath() %>/resource/js/jquery/jquery-1.8.2.js"></script> --%> 
<script type="text/javascript" src="<%=request.getContextPath() %>/resource/js/personInfo.js"></script>
<script type="text/javascript" src="<%=request.getContextPath() %>/resource/js/honeycombtool.js"></script>
<script type="text/javascript" src="<%=request.getContextPath() %>/resource/js/msgConstants.js"></script>

<script>
$(function(){
	var i = 0;
	var str = [1,2,3,4,5,6,7,8];
	$(".person_style_div").eq(0).css("color","red"); 
	$("#"+str[0]).css("display","block");
	$(".person_style_div").each(function(index){
			$(this).click(function(){
				if(i != index){
					$(".person_style_div").eq(index).css("color","red");
					$(".person_style_div").eq(i).css("color","black");
					$("#"+str[index]).css("display","block");
					$("#"+str[i]).css("display","none");
					i = index;
				}
			});
		
	});
});
function doOptions2(meg){
	if(meg == 21){
		$("#21").css("display","block");
		$("#22").css("display","none");
		$("#021").css("background-color","#8CC700");
		$("#022").css("background-color","#C3E99E");
	}
	if(meg == 22){
		$("#21").css("display","none");
		$("#22").css("display","block");
		$("#021").css("background-color","#C3E99E");
		$("#022").css("background-color","#8CC700");
	}
	if(meg == 81){
		$("#81").css("display","block");
		$("#82").css("display","none");
		$("#081").css("background-color","#8CC700");
		$("#082").css("background-color","#C3E99E");
	}
	if(meg == 82){
		$("#81").css("display","none");
		$("#82").css("display","block");
		$("#081").css("background-color","#C3E99E");
		$("#082").css("background-color","#8CC700");
	}
}

</script>
</head>
<body>
<%@ include file="top.jsp" %>
<div class="person_div">
	<div style="float: left;width: 250px ;height: auto;">
		<div class="person_style">订单中心</div>
		<div onclick="doOptions('1')" class="person_style_div">普通订单</div>
		<div onclick="doOptions('2')" class="person_style_div">订单评价</div>
		<div class="person_style">账户中心</div>
		<div onclick="doOptions('3')" class="person_style_div">个人信息</div>
		<div class="person_style_div">账户安全</div>
		<div class="person_style_div">修改密码</div>
		<div class="person_style_div">收货地址</div>
		<div class="person_style">充值中心</div>
		<div class="person_style_div">在线充值</div>
		<div class="person_style_div">充值详情</div>
		<div class="person_style">活动中心</div>
		<div class="person_style_div"></div>
	</div>
	<div id="1" style="float: left;width: 737px;height: auto;border:1px solid  #8CC700;margin-left: 10px;font-size: 13px;display:none">
		<div style="margin-top: 15px;margin-left: 24px;">当前位置：订单中心  > <font color="red">普通订单</font></div>
		<div style="width:692px;height: auto;margin-top: 60px;margin-left: 24px;margin-bottom: 30px;">
				<div style="width: 138px;height: 30px;float: left;background-color: #8CC700;font-size: 15px;line-height: 30px;text-align: center;">订单编号</div>
				<div style="width: 138px;height: 30px;float: left;background-color:  #C3E99E;font-size: 15px;line-height: 30px;text-align: center;">商品说明</div>
				<div style="width: 138px;height: 30px;float: left;background-color: #8CC700;font-size: 15px;line-height: 30px;text-align: center;">订单金额</div>
				<div style="width: 138px;height: 30px;float: left;background-color:  #C3E99E;font-size: 15px;line-height: 30px;text-align: center;">订单时间</div>
				<div style="width: 140px;height: 30px;float: left;background-color: #8CC700;font-size: 15px;line-height: 30px;text-align: center;">订单状态</div>
			<div style="clear:both;"></div>
			<div class='list'>
				<div class="list_div">3752027329486</div>
				<div class="list_div">XXXXXX</div>
				<div class="list_div">$213</div>
				<div class="list_div">2013-07-29 14:01:40</div>
				<div class="list_div">已付款</div>
			</div>
			<div class='list'>
				<div class="list_div">3752027329486</div>
				<div class="list_div">XXXXXX</div>
				<div class="list_div">$213</div>
				<div class="list_div">2013-07-29 14:01:40</div>
				<div class="list_div">已作废</div>
			</div>
			<div class='list'>
				<div class="list_div">3752027329486</div>
				<div class="list_div">XXXXXX</div>
				<div class="list_div">$213</div>
				<div class="list_div">2013-07-29 14:01:40</div>
				<div class="list_div">备货中</div>
			</div>
			<div class='list'>
				<div class="list_div">3752027329486</div>
				<div class="list_div">XXXXXX</div>
				<div class="list_div">$213</div>
				<div class="list_div">2013-07-29 14:01:40</div>
				<div class="list_div">已退货</div>
			</div>
		</div>
	</div>
	<div id="2" style="float:left;width:737px;height:auto;border:1px solid #8cc700;margin-left: 10px;font-size: 13px;display:none">
		<div style="margin-top: 15px;margin-left: 24px;">当前位置：订单中心  > <font color="red">订单评价</font></div>
		<div style="width:692px;height: auto;margin-top: 60px;margin-left: 24px;">
			<div id="021" onclick="doOptions2('21')" style="width: 138px;height: 30px;float: left;background-color: #8CC700;font-size: 15px;line-height: 30px;text-align: center;">未评论</div>
			<div id="022" onclick="doOptions2('22')" style="width: 138px;height: 30px;float: left;background-color:  #C3E99E;font-size: 15px;line-height: 30px;text-align: center;">已评论</div>
			<div style="clear:both;"></div>
		</div>
		<div style="width:692px; height: 0; margin-left: 24px;border:1.5px solid  #8CC700;"></div>
		<div  id="21" style="width:692px;margin-left: 24px;border:1px solid  #C3E99E;height: auto;margin-top:15px;margin-bottom: 30px;display:block">
			<div  style="width:692px;height: auto;">
				<div style="width: 200px;height: 30px;float: left;border:1px solid  #C3E99E;font-size: 15px;line-height: 30px;text-align: center;">商品信息</div>
				<div style="width: 186px;height: 30px;float: left;border:1px solid  #C3E99E;font-size: 15px;line-height: 30px;text-align: center;">购买时间</div>
				<div style="width: 300px;height: 30px;float: left;border:1px solid  #C3E99E;font-size: 15px;line-height: 30px;text-align: center;">操作</div>
				<div style="clear:both;"></div>
				<div style="width: 200px;height: 30px;float: left;font-size: 12px;line-height: 30px;text-align: center;">莴苣</div>
				<div style="width: 186px;height: 30px;float: left;font-size: 12px;line-height: 30px;text-align: center;">2013-07-29 14:01:40</div>
				<div style="width: 300px;height: 30px;float: left;font-size: 12px;line-height: 30px;text-align: center;">删除记录</div>
				<div style="clear:both;"></div>
			</div>
		</div>
		<div  id="22" style="width:692px;margin-left: 24px;border:1px solid  #C3E99E;height: auto;margin-top:15px;margin-bottom: 30px;display:none">
			<div  style="width:692px;height: auto;">
				<div style="width: 130px;height: 30px;float: left;border:1px solid  #C3E99E;font-size: 15px;line-height: 30px;text-align: center;">商品信息</div>
				<div style="width: 200px;height: 30px;float: left;border:1px solid  #C3E99E;font-size: 15px;line-height: 30px;text-align: center;">评论内容</div>
				<div style="width: 200px;height: 30px;float: left;border:1px solid  #C3E99E;font-size: 15px;line-height: 30px;text-align: center;">回复</div>
				<div style="width: 154px;height: 30px;float: left;border:1px solid  #C3E99E;font-size: 15px;line-height: 30px;text-align: center;">操作</div>
				<div style="clear:both;"></div>
				<div style="width: 130px;height: 30px;float: left;font-size: 12px;line-height: 30px;text-align: center;">西红柿</div>
				<div style="width: 200px;height: 30px;float: left;font-size: 12px;line-height: 30px;text-align: center;">很新鲜</div>
				<div style="width: 200px;height: 30px;float: left;font-size: 12px;line-height: 30px;text-align: center;">欢迎再来</div>
				<div style="width: 154px;height: 30px;float: left;font-size: 12px;line-height: 30px;text-align: center;">删除记录</div>
				<div style="clear:both;"></div>
			</div>
		</div>
	</div>
	<div id="3" style="float: left;width: 737px;height: auto;border:1px solid  #8CC700;margin-left: 10px;font-size: 13px;display:none">
		<div style="margin-top: 15px;margin-left: 24px;">当前位置：账户中心  > <font color="red">个人信息</font></div>
		<div style="width:692px;height: auto;margin-top: 60px;margin-left: 24px;">
			<div  style="width: 138px;height: 30px;float: left;background-color: #8CC700;font-size: 15px;line-height: 30px;text-align: center;">基本资料</div>
			<div  style="float:left;margin-left:100px;margin-top:7px;font-size:12px">*号为必填项</div>
			<div style="clear:both;"></div>
		</div>
		<div style="width:692px;margin-left: 24px;border:1.5px solid  #8CC700;"></div>
		<div style="width:692px;margin-left: 24px;border:1px solid  #C3E99E;height: auto;margin-top:15px;margin-bottom: 30px;display:block">
				<div style="width: 550px;height: auto;margin-left:100px;margin-top:20px;margin-bottom:10px;border:1px solid white;">
						<div style="margin-bottom:10px">当前昵称：<input id="userPersoninfoNickname" maxlength="10" name="userPersoninfoNickname" onblur="checkUserPersoninfoNickname()" type="text" style="height:25px;width:200px;">
						<span id="userPersoninfoNicknameError" style="margin-left:20px"></span>
						</div>
						<div style="margin-bottom:10px">真实姓名：<input id="userPersoninfoRealname" name="userPersoninfoRealname" onblur="checkUserPersoninfoRealname()" type="text" style="height:25px;width:200px;">&nbsp;&nbsp;*
						<span id="userPersoninfoRealnameError"></span>
						</div>
						<div style="margin-bottom:10px">&nbsp;&nbsp;&nbsp;&nbsp;邮箱：<input type="text" style="height:25px;width:200px;" value="当前邮箱（不可修改）"></div>
						<div style="margin-bottom:10px">&nbsp;&nbsp;&nbsp;&nbsp;性别：<input type="radio" name="userPersoninfoSex" value="MALE" checked="checked">男
																					<input type="radio" name="userPersoninfoSex" value="FEMALE">女<span style="margin-left:143px;"></span></div>
						<div style="margin-bottom:10px">&nbsp;&nbsp;&nbsp;&nbsp;生日：<input type="text" style="height:25px;width:200px;" value="当前生日（不可修改）"></div>
						<div style="margin-bottom:10px">&nbsp;&nbsp;&nbsp;&nbsp;手机：<input id="userPersoninfoPhoneNumber" name="userPersoninfoPhoneNumber" onblur="checkUserPersoninfoPhoneNumber('userPersoninfoPhoneNumber','userPersoninfoPhoneNumberError')" type="text" style="height:25px;width:200px;">&nbsp;&nbsp;*
						<span id="userPersoninfoPhoneNumberError"></span>
						</div>
						<div style="margin-bottom:10px">填写地址:&nbsp;&nbsp;成都市&nbsp;&nbsp;<select id="userPersoninfoCitySelect" onchange="checkUserPersoninfoCitySelect()">
																								<option value="-1">请选择(区/县)</option>
																								<option value="1">青羊区</option>
																								<option value="2">锦江区</option>
																								<option value="3">金牛区</option>
																								<option value="4">武侯区</option>
																								<option value="5">成华区</option>
																								<option value="6">新都区</option>
																								<option value="7">温江区</option>
																								<option value="8">高新区</option>
																								<option value="9">高新西区</option>
																								<option value="10">龙泉驿区</option>
																								<option value="11">青白江区</option>
																								<option value="12">郫县</option>
																								<option value="13">金堂县</option>
																								<option value="14">双流县</option>
																								<option value="15">大邑县</option>
																								<option value="16">蒲江县</option>
																								<option value="17">新津县</option>
																								<option value="18">崇州市</option>
																								<option value="19">邛崃市</option>
																								<option value="20">彭州市</option>
																								<option value="21">都江堰市</option>
																							</select>
						<span id="userPersoninfoCitySelectError" style="margin-left:47px">*</span>
						</div>
						<div style="margin-bottom:10px">详细地址：<input id="userPersoninfoAddress" name="userPersoninfoAddress" onblur="checkUserPersoninfoAddress('userPersoninfoAddress','userPersoninfoAddressError')" type="text" style="height:25px;width:200px;">&nbsp;&nbsp;*
						<span id="userPersoninfoAddressError"></span>
						</div>
						<div style="margin-bottom:10px;margin-left:330px;"><input type="submit" class="little_button_style" value="提交"></div>
				</div>
			
		</div>
	</div>
	<div id="4" style="float: left;width: 737px;height: auto;border:1px solid  #8CC700;margin-left: 10px;font-size: 13px;display:none">
		<div style="margin-top: 15px;margin-left: 24px;">当前位置：账户中心  > <font color="red">账户安全</font></div>
		<div style="width:692px;height: auto;margin-top: 60px;margin-left: 24px;"></div>
	
	</div>
	<div id="5" style="float: left;width: 737px;height: auto;border:1px solid  #8CC700;margin-left: 10px;font-size: 13px;display:none">
		<div style="margin-top: 15px;margin-left: 24px;">当前位置：账户中心  > <font color="red">修改密码</font></div>
		<div style="width:692px;height: auto;margin-top: 60px;margin-left: 24px;">
			<div  style="width: 138px;height: 30px;float: left;background-color: #8CC700;font-size: 15px;line-height: 30px;text-align: center;">修改密码</div>
			<div style="clear:both;"></div>
			<div style="width:692px;heigtht:0;border:1.5px solid  #8CC700;"></div>
			<div style="width:692px;border:1px solid  #C3E99E;height: auto;margin-top:15px;margin-bottom: 30px;">
				<div style="width: 550px;height: auto;margin-left:50px;margin-top:20px;margin-bottom:10px;border:1px solid white;">
					<div style="margin-bottom:10px;margin-left:12px">旧密码：<input id="userPersoninfoPassword" maxlength="10" name="userPersoninfoPassword" onblur="checkUserPersoninfoPassword('userPersoninfoPassword','userPersoninfoPasswordError')" type="text" style="height:25px;width:200px;">
						<span id="userPersoninfoPasswordError" style="margin-left:20px"></span>
					</div>	
					<div style="margin-bottom:10px;margin-left:12px">新密码：<input id="userPersoninfoNewPassword" maxlength="10" name="userPersoninfoNewPassword" onblur="checkUserPersoninfoPassword('userPersoninfoNewPassword','userPersoninfoNewPasswordError')" type="text" style="height:25px;width:200px;">
						<span id="userPersoninfoNewPasswordError" style="margin-left:20px"></span>
					</div>
					<div style="margin-bottom:10px">确认密码：<input id="userPersoninfoRePassword" maxlength="10" name="userPersoninfoRePassword" onblur="checkUserPersoninfoRePassword()" type="text" style="height:25px;width:200px;">
						<span id="userPersoninfoRePasswordError" style="margin-left:20px"></span>
					</div>
					<div style="margin-bottom:10px;margin-left:300px;"><input type="submit" class="little_button_style" value="提交"></div>
				</div>	
			</div>
		</div>
	</div>
	<div id="6" style="float: left;width: 737px;height: auto;border:1px solid  #8CC700;margin-left: 10px;font-size: 13px;display:none">
		<div style="margin-top: 15px;margin-left: 24px;">当前位置：账户中心  > <font color="red">收货地址</font></div>
		<div style="width:692px;height: auto;margin-top: 60px;margin-left: 24px;">
			<div style="width: 138px;height: 30px;float: left;background-color:  #8CC700;font-size: 15px;line-height: 30px;text-align: center;">收货人</div>
			<div style="width: 258px;height: 30px;float: left;background-color: #C3E99E;font-size: 15px;line-height: 30px;text-align: center;">收货地址</div>
			<div style="width: 152px;height: 30px;float: left;background-color:  #8CC700;font-size: 15px;line-height: 30px;text-align: center;">手机</div>
			<div style="width: 140px;height: 30px;float: left;background-color: #C3E99E;font-size: 15px;line-height: 30px;text-align: center;">操作</div>
			<div style="clear:both;"></div>
			<div style="width: 686px;height: 25px;border-left: 1px solid #C3E99E;border-bottom: 1px solid #C3E99E;border-right: 1px solid #C3E99E;">
				<div style="width:138px;float: left;font-size: 12px;text-align: center;line-height: 25px;">王先生</div>
				<div style="width:258px;float: left;font-size: 12px;text-align: center;line-height: 25px;" class="list_Address_div">学府路1段24号</div>
				<div style="width:150px;float: left;font-size: 12px;text-align: center;line-height: 25px;" class="list_Address_div">182XXXXXXXX</div>
				<div style="width:140px;float: left;font-size: 12px;text-align: center;line-height: 25px;" class="list_Address_div">删除</div>
			</div>
			<div style="clear:both;"></div>
			<div style="width: 686px;height: 25px;border-left: 1px solid #C3E99E;border-bottom: 1px solid #C3E99E;border-right: 1px solid #C3E99E;">
				<div style="width:138px;float: left;font-size: 12px;text-align: center;line-height: 25px;">王先生</div>
				<div style="width:258px;float: left;font-size: 12px;text-align: center;line-height: 25px;" class="list_Address_div">学府路1段24号</div>
				<div style="width:150px;float: left;font-size: 12px;text-align: center;line-height: 25px;" class="list_Address_div">182XXXXXXXX</div>
				<div style="width:140px;float: left;font-size: 12px;text-align: center;line-height: 25px;" class="list_Address_div">删除</div>
			</div>
		</div>
		<div style="width:692px;height: auto;margin-top: 60px;margin-left: 24px;">
			<div  style="width: 138px;height: 30px;float: left;background-color: #8CC700;font-size: 15px;line-height: 30px;text-align: center;">新的收货地址</div>
			<div  style="float:left;margin-left:100px;margin-top:7px;font-size:12px">*号为必填项</div>
			<div style="clear:both;"></div>
			<div style="width:692px;heigtht:0;border:1.5px solid  #8CC700;"></div>
			<div style="width:692px;border:1px solid  #C3E99E;height: auto;margin-top:15px;margin-bottom: 30px;">
				<div style="width: 550px;height: auto;margin-left:50px;margin-top:20px;margin-bottom:10px;border:1px solid white;">
					<div style="margin-bottom:10px;margin-left:12px">收货人：<input id="userPersoninfoReceiverName" maxlength="10" name="userPersoninfoReceiverName" onblur="checkUserPersoninfoReceiverName()" type="text" style="height:25px;width:200px;">
						*<span id="userPersoninfoReceiverNameError" style="margin-left:20px"></span>
					</div>	
					<div style="margin-bottom:10px;margin-left:24px">地址：成都市&nbsp;&nbsp;<select>
																								<option value="-1">请选择(区/县)</option>
																								<option value="1">青羊区</option>
																								<option value="2">锦江区</option>
																								<option value="3">金牛区</option>
																								<option value="4">武侯区</option>
																								<option value="5">成华区</option>
																								<option value="6">新都区</option>
																								<option value="7">温江区</option>
																								<option value="8">高新区</option>
																								<option value="9">高新西区</option>
																								<option value="10">龙泉驿区</option>
																								<option value="11">青白江区</option>
																								<option value="12">郫县</option>
																								<option value="13">金堂县</option>
																								<option value="14">双流县</option>
																								<option value="15">大邑县</option>
																								<option value="16">蒲江县</option>
																								<option value="17">新津县</option>
																								<option value="18">崇州市</option>
																								<option value="19">邛崃市</option>
																								<option value="20">彭州市</option>
																								<option value="21">都江堰市</option>
																							</select>
							<span  style="margin-left:40px">*</span>
						</div>
					<div style="margin-bottom:10px;margin-left:0">详细地址：<input  id="userPersoninfoNewAddress" name="userPersoninfoNewAddress" onblur="checkUserPersoninfoAddress('userPersoninfoNewAddress','userPersoninfoNewAddressError')" type="text" style="height:25px;width:200px;">
						*<span  id="userPersoninfoNewAddressError" style="margin-left:20px"></span>
					</div>	
					<div style="margin-bottom:10px;margin-left:24px">邮编：<input type="text" style="height:25px;width:200px;">
						<span style="margin-left:20px"></span>
					</div>
					<div style="margin-bottom:10px;margin-left:24px">手机：<input id="userPersoninfoNewPhoneNumber" name="userPersoninfoNewPhoneNumber" onblur="checkUserPersoninfoPhoneNumber('userPersoninfoNewPhoneNumber','userPersoninfoNewPhoneNumberError')" type="text" style="height:25px;width:200px;">
						*<span id="userPersoninfoNewPhoneNumberError" style="margin-left:20px"></span>
					</div>
					<div style="margin-bottom:10px;margin-left:300px;"><input type="submit" class="little_button_style" value="提交"></div>
				</div>
			</div>
		</div>
	</div>
	<div id="7" style="float: left;width: 737px;height: auto;border:1px solid  #8CC700;margin-left: 10px;font-size: 13px;display:none">
		<div style="margin-top: 15px;margin-left: 24px;">当前位置：充值中心  > <font color="red">在线充值</font></div>
		<div style="width:692px;height: auto;margin-top: 60px;margin-left: 24px;"></div>
	
	</div>
	<div id="8" style="float: left;width: 737px;height: auto;border:1px solid  #8CC700;margin-left: 10px;font-size: 13px;display:none">
		<div style="margin-top: 15px;margin-left: 24px;">当前位置：充值中心  > <font color="red">充值详情</font></div>
		<div style="width:692px;height: auto;margin-top: 60px;margin-left: 24px;">
			<div id="081" onclick="doOptions2('81')" style="width: 138px;height: 30px;float: left;background-color: #8CC700;font-size: 15px;line-height: 30px;text-align: center;">充值记录</div>
			<div id="082" onclick="doOptions2('82')" style="width: 138px;height: 30px;float: left;background-color:  #C3E99E;font-size: 15px;line-height: 30px;text-align: center;">余额消费记录</div>
			<div style="clear:both;"></div>	
		</div>
		<div style="width:692px; height: 0; margin-left: 24px;border:1.5px solid  #8CC700;"></div>
		<div  id="81" style="width:692px;margin-left: 24px;border:1px solid  red;height: auto;margin-top:15px;margin-bottom: 30px;display:block">
			<div style="width:692px;border:1px solid  #C3E99E;height: auto;">
			<div  style="float: left;border:1px solid  red;width:200px;height: 20px;margin-left:100px;font-size: 12px;line-height: 20px;">您当前的余额为:<font color="red">￥0.00</font></div>
			<div style="float: left;margin-bottom:10px;margin-left:100px;"><input type="submit" class="little_button_style" value="充值"></div>
			</div>
		</div>
	</div>
</div>
<%@ include file="foot.jsp" %>
</body>
</html>